import styled from 'styled-components'
import { px2rem } from '@/assets/global-style'
export const Container = styled.div `
    margin-top:  ${px2rem(15)};
    margin-left: ${px2rem(15)};
    .title {
        font-size: ${px2rem(15)};
        font-weight: 620;
        margin-top: ${px2rem(15)};
    }
    .cityselect {
        font-size: ${px2rem(15)};
        margin-top: ${px2rem(20)};
    }
    .pos {
        margin-top: ${px2rem(14)};
        padding:${px2rem(2)} ${px2rem(5)};
        line-height:  ${px2rem(20)};
        width: ${px2rem(80)};
        border: 1px solid #666;
        font-size: ${px2rem(12)};
        font-weight:400;
        .icon {
            font-size: ${px2rem(20)};
        }
        span {
           
        }
    }
    .city-content {
        margin-top: ${px2rem(14)};
        display: flex;
        flex-direction: row;
        flex-wrap:wrap;
        .city-list {
            margin-top: ${px2rem(4)};
            margin-right: ${px2rem(6)};
            text-align: center;
            img {
                width: ${px2rem(78)};
                height: ${px2rem(60)};
            }
            
        }
    }
    .btn-bottom {
        display: flex;
        position: absolute;
        left:0;
        bottom: ${px2rem(10)};
        z-index: 99;
        flex-direction: row;
        justify-content: space-between;
        .btn-reset {
            margin-right: ${px2rem(20)};
            width: 45.6vw;
            text-align: center;
            color: rgb(51, 51, 51);
            height: 11.2vw;
            line-height: 11.2vw;
            font-size: 4.26667vw;
            background-color: rgb(247, 248, 250);
            border-radius: 5.86667vw;
        }
        .btn-confirm {
            width: 45.6vw;
            text-align: center;
            color: rgb(51, 51, 51);
            background-color: rgb(255, 221, 0);
            height: 11.2vw;
            line-height: 11.2vw;
            font-size: 4.26667vw;
            border-radius: 5.86667vw;
        }
    }
`